import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    // 购物车数据
    cartList: [{ id: 1, name: "Apple" }],
    isOk: false, // 是否购物成功
  },

  mutations: {
    addGood(state, goodName) {
      state.cartList.push({
        id: 2,
        name: goodName,
      });
    },

    // 清空购物车
    clearCartList(state) {
      state.cartList = [];
    },

    // 成功了
    success(state) {
      state.isOk = true;
    },

    // 失败了
    fail(state, payload) {
      state.cartList = payload;
    },
  },

  actions: {
    pay({ commit, state }, payload) {
      // 1. 先将当前购物车数据备份一下。
      // state.cartList 是可以获取到数据的，但是不要进行修改。
      // 思考 state.cartList push reverse pop unshift 等7个函数能不能使用   不可以
      // const copyCartList = [...state.cartList]; // 浅拷贝
      const copyCartList = JSON.parse(JSON.stringify(state.cartList)); // 深拷贝

      // 2. 自信的将购物车数据清空
      commit("clearCartList");
      // 3. 调用接口
      setTimeout(() => {
        // 失败了，要将购物车数据给放回来恢复
        // commit("fail", copyCartList);

        // 成功了
        commit("success");
      }, 1000);
    },
  },
});
